<template>
	<div>
	    <header>
        <h3>我的考勤页</h3>
        <p>12月
        <span>第x周</span>
        <span>2016年<i>v</i></span>
        </p>
        <p>
           <span v-for="day in week">{{day}}</span>
        </p>   
    </header>
    <table class="tb" >
        <caption style="font-size: 16px">{{xueqi}}</caption>
        <thead bgcolor="#9ed885" >
        <tr height="40">
            <td width="100" v-for="">11</td>
        </tr>
        </thead>
        <tbody width="" valign="top">
        <tr v-for="obj in subject_arr" >
            <td width="100"  v-for="obj1 in obj" >{{obj1}}</td>
        </tr>
        </tbody>
        <tfoot align="center" bgcolor="gray" >
        <tr  align="center" >
            <td colspan="9" height="30"><font color="white">{{school}}{{faculty}}{{classname}}</font></td>
        </tr>
        </tfoot>
    </table>
   
    <footer>
        <p class="ftp">版权归属©xxx责任有限公司</p>
    </footer>
	</div>
	 

</template>
<script type="text/javascript" src="vue.js"></script>
<script type="text/javascript">
        
        var week=["日","一","二","三","四","五","六"];
        export default{
           data(){
               	return{
                    xuehao:12327213456,
                     name:"xxx",
                     school:"华南理工大学",
                     faculty:"计算机学院",
                     classname:"16级软件应用3班",
                     xueqi:"2016年-2017年第一学期",
                     week:"week",  
               	}
           }
        }
      
</script>
<style type="text/css">
    body{
        background:rgba(168,228,172,0.8);
    }
    h3{
        text-align: center;
        padding: 10px;
        font-size: 0.2rem;
        background: orange;
        margin-bottom: 0.1rem;
    }
    h3~p{
        padding-left:10px;
        font-size: 15px; 
    }
    thead tr td{
        text-align: center;
    }
    .ftp{
        text-align: center;
        background: black;
        color: white;
        padding: 10px;
    }
    tbody tr td{
        background:#c1b9b9;
        text-align: center;
        padding: 10px 2px;

        /*这是让字体超出显示...效果*/
       /* white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;*/
    }
</style>
